import Vue from 'vue'
import App from './App.vue'
import store from './store'
import router from '@/router/'

import toast from '@/components/common/toast'
import VueLazyload from 'vue-lazyload'
import Fastclick from 'fastclick'

Vue.config.productionTip = false;

Vue.use(VueLazyload, {
  preLoad: 1,
  // error: require('./assets/img/error.jpg'),
  loading: require('./assets/images/common/placeholder.png'),
  attempt: 2,
})
// 解决移动端300ms延迟
Fastclick.attach(document.body)

// 添加事件总线对象
Vue.prototype.$bus = new Vue();
// 安装toast插件
Vue.use(toast)



new Vue({
  data: {
    screenWidth: document.body.clientWidth, // 文档宽度，默认值，watch中监听它
    RemFunc: function () {  // 计算rem布局函数
      let oHtmlElem = document.documentElement, nWinWid = oHtmlElem.clientWidth / 7.5;
      if (nWinWid > 100) nWinWid = 100;
      oHtmlElem.style.fontSize = nWinWid + 'px';
    }
  },
  created() {
    // 页面创建时使用rem布局函数
    this.RemFunc();
  },
  mounted() {
    const that = this
    window.onresize = () => { // onresize监听窗口缩放
      return (() => {
        window.screenWidth = document.body.clientWidth
        that.screenWidth = window.screenWidth
      })()
    }
  },
  watch: {
    screenWidth(val) {  // watch监听this.screenWidth值变化，如果变化了执行this.RemFunc()
      this.screenWidth = val
      this.RemFunc()
    }
  },
  store,
  router,
  render: h => h(App),
}).$mount('#app')
